﻿@model Category
@using NITASA.Data
@using GridMvc.Html
@{
    ViewBag.Title = "Categories";
    List<Category> CategoryList = ViewBag.CategoryList;
}
<div class="main-content">
    <div class="container-fluid padded">
        @if (TempData["SuccessMessage"] != null)
        {
            <div class="alert alert-success">
                <button class="close" data-dismiss="alert" type="button">×</button>
                @TempData["SuccessMessage"]
            </div>
        }
        @if (TempData["ErrorMessage"] != null)
        {
            <div class="alert alert-error">
                <button class="close" data-dismiss="alert" type="button">×</button>
                @TempData["ErrorMessage"]
            </div>
        }
        <div class="row-fluid">
            <div class="span12">
                <div class="box">
                    <div class="box-header">
                        <span class="title">Browse Category</span>
                        <ul class="box-toolbar">
                            <li><a data-toggle="modal" id="AddCat" href="#modal-Category"><i class="icon-plus-sign" style="margin-top: 10px"></i></a></li>
                        </ul>
                    </div>
                    <div class="box-content">
                        @if (CategoryList.Count() > 0)
                        {
                            @Html.Grid(CategoryList).Columns(columns =>
                            {
                                columns.Add(x => x.Name).Titled("Category Name").Sortable(true).Filterable(true);
                                columns.Add().RenderValueAs(x =>
                                    @customcolumn(x)
                                    ).Sanitized(false).Encoded(false).Titled("Actions").SetWidth(80);
                            }).WithPaging(10, 5).WithMultipleFilters()
                        }
                        else
                        {
                        <div class="padded">No Category Found.</div>
                        }
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@helper customcolumn(Category item)
{    
    @Html.ActionLink("Edit", null, null, new { @class = "btn btn-small btn-blue edit-cat" })
    @Html.ActionLink("Delete", null, null, new { @class = "btn btn-small btn-red delete-cat" })
    <input type="hidden" class="catGUID" value="@item.GUID" />
}
<div id="modal-confirm" class="modal hide fade" style="width: 370px;">
    <div class="modal-header">
        <a class="close modal_Delete_icon_link" data-dismiss="modal" href="">
            <i class="icon-remove-sign modal_close_icon_fontsize"></i>
        </a>
        <h6 id="H1">Confirmation</h6>
    </div>
    <div class="modal-body">
        <table class="width100per">
            <tr>
                <td id="delete-msg">
                    Are you sure you want to delete this caetgory ?
                </td>
            </tr>
            <tr>
                <td align="right">
                    @Html.ActionLink("Delete", "Delete", "Category", new { id = "dltCat", @class = "btn btn-red" })
                </td>
            </tr>
        </table>
    </div>
</div>

<div id="modal-Category" class="modal hide fade" style="width: 500px;">
    <div class="modal-header">
        <a class="close modal_Delete_icon_link" data-dismiss="modal" href="">
            <i class="icon-remove-sign modal_close_icon_fontsize"></i>
        </a>
        <h6 id="lblCatModalName">Add New Category</h6>
    </div>
    <div class="modal-body">
        @using (Html.BeginForm("Add", "Category", FormMethod.Post))
        {
            <div class="control-group">
                <label class="control-label" style="text-align: left;">
                    Category Name
                </label>
                <div class="controls">
                    @Html.TextBoxFor(m => m.Name, new { style = "width:90%" })
                    <div style="color: red">
                        @Html.ValidationMessageFor(m => m.Name)
                    </div>
                </div>
            </div>
            <div class="control-group">
                <label class="control-label" style="text-align: left;">
                    Category Slug
                </label>
                <div class="controls">
                    @Html.TextBoxFor(m => m.Slug, new { style = "width:90%" })
                    <div style="color: red">
                        @Html.ValidationMessageFor(m => m.Slug)
                    </div>
                </div>
            </div>
            <div class="control-group">
                <label class="control-label" style="text-align: left;">
                    Category Description
                </label>
                <div class="controls">
                    @Html.TextAreaFor(m => m.Description, new { style = "width:90%;max-width:90%;" })
                    <div style="color: red">
                        @Html.ValidationMessageFor(m => m.Description)
                    </div>
                </div>
            </div>
            <div class="control-group">
                <label class="control-label" style="text-align: left;"></label>
                <div class="controls">
                    <input type="submit" value="Save" id="btnAddCat" class="btn btn-blue" />
                    @*<input type="button" value="Cancel" id="ClearCat" class="btn btn-blue" />*@
                    <input type="hidden" value="" id="CGUID" name="CGUID" />
                </div>
            </div>
        }
    </div>
</div>

<script type="text/javascript">
    $("#AddCat").click(function () {
        $("#CGUID").val("");
        $("#lblCatModalName").html('Add New Category');
        $("#Name").val("");
        $("#Slug").val("");
        $("#Description").val("");
        $("#btnAddCat").val("Save");
    });
    $(".edit-cat").click(function () {
        debugger;
        var guid = $(this).parent().find(".catGUID").val();
        $.ajax({
            type: "Get",
            url: "/Admin/Category/GetCategoryDetails",
            data: { GUID: guid },
            success: function (data) {
                if (data) {
                    $("#Name").val(data.Name);
                    $("#Slug").val(data.Slug);
                    $("#Description").val(data.Description);
                    $("#CGUID").val(guid);
                    $("#lblCatModalName").html('Update Category');
                    $("#btnAddCat").val("Update");
                    $("#modal-Category").modal('show');
                }
            },
            error: function (data) {
                console.log(data);
            }
        });
        return false;
    });

    $(".delete-cat").click(function () {
        var GUID = $(this).parent().find(".catGUID").val();
        $.ajax({
            type: "POST",
            url: '/Admin/Category/PostCount',
            data: { GUID: GUID },
            dataType: "json",
            success: function (data) {
                if (parseInt(data) > 0)
                    $("#delete-msg").html("Category contains " + data + " post, </br>Are you sure you want to delete this caetgory ?");
                else
                    $("#delete-msg").html("Are you sure you want to delete this caetgory ?");
                $("#dltCat").attr("href", "/Admin/Category/Delete/" + GUID);
                $("#modal-confirm").modal('show');
            }
        });
        return false;
    });
</script>
